<template>
	<view>
		<view class="body">
		    <view class="no-content" v-if="coupon.length == 0 && goods.length == 0">暂无兑换记录</view>
		    <view style="border-top: 1rpx solid #e2e2e2" v-else>
		        <view class="exchange flex-row" v-for="(item, index) in coupon" :key="item.id">
		            <view class="flex-grow-1">
		                <view class="cpupon-name text-more">{{ item.coupon.name }} 满{{ item.coupon.min_price }}元可用</view>
		                <view class="cpupon-price">
		                    {{ item.integral }}{{money_name}}
		                    <block v-if="item.price > 0">+{{ item.price }}</block>
		                </view>
		            </view>
		
		            <view class="flex-row flex-grow-0 flex-y-center" style="margin-left: 40rpx">
		                <navigator hoverClass="none" :url="'/pages/coupon/coupon?status=' + item.status">
		                    <view class="chakan">我的优惠券</view>
		                </navigator>
		            </view>
		        </view>
		        <view class="exchange flex-row" v-for="(item, index) in goods" :key="item.id">
		            <view class="flex-grow-1 flex-row">
		                <view class="flex-grow-0">
		                    <image class="goods-img" :src="item.pic"></image>
		                </view>
		                <view class="goods-detail flex-grow-1 flex-y-center">
		                    <view>
		                        <view class="goods-name">{{ item.goods_name }}</view>
		                        <view class="goods-price">
		                            {{ item.pay_integral }}{{money_name}}
		                            <block v-if="item.total_price > 0">+{{ item.total_price }}</block>
		                        </view>
		                    </view>
		                </view>
		            </view>
		
		            <view class="flex-grow-0 flex-row flex-y-center" style="margin-left: 40rpx">
		                <navigator hoverClass="none" :url="'/pages2/integral-mall/clerk/clerk?id=' + item.order.order_no + '&type=exchange'">
		                    <view class="chakan" :data-id="item.order.order_no">订单详情</view>
		                </navigator>
		            </view>
		        </view>
		        <view style="font-size: 9pt; color: #eee" v-if="is_no_more">--没有更多记录--</view>
		    </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				p: 1,
				goods: [],
				coupon: '',
				page: '',
				is_no_more: '',
				money_name:this.globalData.money_name,
			}
		},
		methods: {
			
		}
	}
</script>

<style>
page {
    background-color: #fff;
}

.exchange {
    border-bottom: 1rpx solid #e2e2e2;
    padding: 40rpx 24rpx;
}

.cpupon-name {
    color: #353535;
    margin-bottom: 22rpx;
}

.cpupon-price {
    color: #ff6f28;
}

.chakan {
    height: 56rpx;
    border: 1rpx solid #ff4544;
    border-radius: 28rpx;
    color: #ff4544;
    padding: 0 16rpx;
    display: flex;
    align-items: center;
}

.goods-img {
    width: 180rpx;
    height: 136rpx;
}

.goods-detail {
    margin-left: 16rpx;
    font-size: 9pt;
}

.goods-name {
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 28rpx;
    color: #353535;
    height: 2.8em;
    line-height: 1.4;
}

.goods-price {
    color: #ff6f28;
}

.no-content {
    color: #888;
    padding: 100rpx 0 0 0;
    text-align: center;
}
</style>
